<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>一元夺宝首页</title>
    <!-- 依赖的类库和插件 -->
    <link rel="stylesheet" href="/asset/plugins/swiper/swiper.min.css">
    <!-- 公共样式 -->
    <link rel="stylesheet" href="../css/api.css">
    <link rel="stylesheet" href="../css/aui.2.0.css">
    <link rel="stylesheet" href="../css/common.css">
    <!-- 页面样式 -->
    <link rel="stylesheet" href="../css/index.css">
</head>
<body id="app">
    <!-- 顶部页头 start -->
    <div id="header" class="main-header">
        <header class="aui-bar aui-bar-nav header-red" id="aui-header-one">
            <div class="aui-title">{{ lang.com_title }}</div>
            <a class="aui-pull-right">{{ lang.com_rule }}</a>
        </header>
    </div>
    <!-- 顶部页头 end -->
    <!-- 主要正文 start -->
    <div class="main-content" id="main">
        <!-- 焦点广告轮播图 start -->
        <div class="swiper-container" id="swiper">
            <div class="swiper-wrapper" >
                <div class="swiper-slide" v-for="row in focus"><img v-bind:src="focus_path + row.img_name"></div>
            </div>
            <div class="swiper-pagination"></div>
            <div class="swiper-button-next"></div>
            <div class="swiper-button-prev"></div>
        </div>
        <!-- 焦点广告轮播图 end -->
        <div class="index-nav" id="index-nav">
            <ul>
                <a>
                    <span class="index-nav-icon icon01"></span>
                    <p>{{ lang.home_nav_a }}</p>
                </a>
                <a>
                    <span class="index-nav-icon icon02"></span>
                    <p>{{ lang.home_nav_b }}</p>
                </a>
                <a>
                    <span class="index-nav-icon icon03"></span>
                    <p>{{ lang.home_nav_c }}</p>
                </a>
                <a>
                    <span class="index-nav-icon icon04"></span>
                    <p>{{ lang.home_nav_d }}</p>
                </a>
            </ul>
        </div>
        <div class="aui-content index-list">
            <ul>
                <li class="aui-col-xs-6" v-for="row in product">
                    <div class="countdown timer" data-end-time="{{ row.end_time }}"><span></span></div>
                    <a><img v-bind:src="row.thumb" /></a>
                    <p class="aui-ellipsis-2">{{row.title}}</p>
                    <div class="operate">
                        <!--进度条开始-->
                        <div class="progress_bar">
                            <div class="percent">{{ lang.com_sale_number }}<span></span></div>
                            <div class="barline probar">
                                <div class="line gradient" v-bind:percent="row.sale_percent" v-bind:number="row.sale_number" style="width:0px;"></div>
                            </div>
                        </div>
                        <!--进度条结束-->
                        <button class="red-btn">{{ lang.com_buy }}</button>
                    </div>
                </li>
                <div class="aui-clearfix"></div>
            </ul>
        </div>
    </div>
    <!-- 主要正文 end -->
    <!-- 底部导航 start -->
    <footer class="aui-bar aui-bar-tab" id="footer">
        <div class="aui-bar-tab-item aui-active">
            <span class="footer-icon icon01"></span>
            <div class="aui-bar-tab-label">{{ lang.footer_nav_a }}</div>
        </div>
        <div class="aui-bar-tab-item">
            <span class="footer-icon icon02"></span>
            <div class="aui-bar-tab-label">{{ lang.footer_nav_b }}</div>
        </div>
        <div class="aui-bar-tab-item">
            <!--<div class="aui-badge">99</div>-->
            <span class="footer-icon icon03"></span>
            <div class="aui-bar-tab-label">{{ lang.footer_nav_c }}</div>
        </div>
        <div class="aui-bar-tab-item">
            <!--<div class="aui-dot"></div>-->
            <span class="footer-icon icon04"></span>
            <div class="aui-bar-tab-label">{{ lang.footer_nav_d }}</div>
        </div>
    </footer>
    <!-- 底部导航 end -->
</body>
<!-- 依赖的类库和插件 -->
<script type="text/javascript" src="/asset/vue.js"></script>
<script type="text/javascript" src="/asset/jquery/jquery-2.2.1.min.js"></script>
<script type="text/javascript" src="/asset/plugins/swiper/swiper.min.js"></script>
<!-- 公共脚本 -->
<script type="text/javascript" src="../config/app.js"></script>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<!-- 数据模型 -->
<script type="text/javascript" src="../model/index.js"></script>
</html>
